<!DOCTYPE html>
<html>

    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
        <meta name="apple-mobile-web-app-capable" content="yes">
        <meta name="apple-mobile-web-app-status-bar-style" content="black">
        <title></title>
        <link rel="stylesheet" type="text/css" href="../css/mui.min.css" />
        <link rel="stylesheet" type="text/css" href="../css/common.css" />
        <style type="text/css">
        	.mui-table-view {
        		margin-bottom: 10px;
        	}
        	
            .balance.mui-table-view-cell {
                padding: 0;
                height: 68px;
            }
            
            #money {
                color: #FEB406;
                font-weight: 600;
            }
            
            .balance i {
                font-size: 34px;
            }
            
            .balance a.mui-navigate-right:after {
                right: 15px;
                content: '账单 \e583';
            }
            
            .mui-col-xs-6 {
                background-color: #FFFFFF;
                text-align: center;
                height: 43px;
                line-height: 43px;
            }
            
            .mui-col-xs-6:active {
                background-color: #efeff4;
            }
            
            .mui-col-xs-6:first-child {
                border-right: 1px solid #efeff4;
            }
            
            .mui-col-xs-6:last-child {
                border-left: 1px solid #efeff4;
                margin-bottom: 10px;
            }
            
            .iconfont {
                margin-right: 12px;
                font-size: 20px;
                color: #FEB406; 
            }
            
            .mui-table-view-cell>a:not(.mui-btn) {
                padding: 0 15px;
                line-height: 44px;
            }
            
            .balance.mui-table-view-cell>a:not(.mui-btn) {
                margin: 0;
                line-height: 68px;
            }
            
            #payment #pay_psw {
                font-size: 12px;
                margin-right: 25px;
            }
        </style>
    </head>

    <body>
        <header class="mui-bar mui-bar-nav">
            <a class="mui-action-back mui-icon mui-icon-back mui-icon-left-nav mui-pull-left"></a>
            <h1 class="mui-title">我的钱包</h1>
            <a class="mui-icon mui-pull-right iconfont">&#xe61e;</a>
        </header>
        <div class="mui-content">
            <ul class="mui-table-view">
                <li class="mui-table-view-cell balance" id="bills">
                    <a class="mui-navigate-right">
                        <i class="iconfont">&#xe627;</i>
                        <span>账户余额</span>
                        <span id="money"></span>
                    </a>
                </li>
            </ul>
            <div class="mui-row">
                <div class="mui-col-xs-6" id="recharge">
                    <i class="iconfont">&#xe62d;</i>充值
                </div>
                <div class="mui-col-xs-6" id="draw-money">
                    <i class="iconfont">&#xe611;</i>提现
                </div>
            </div>
            <ul class="mui-table-view">
                <li class="mui-table-view-cell" id="account">
                    <a class="mui-navigate-right">
                        <i class="iconfont">&#xe6f7;</i> 我的常用账户
                    </a>
                </li>
                <li class="mui-table-view-cell" id="ticket">
                    <a class="mui-navigate-right">
                        <i class="iconfont">&#xe665;</i> 我的现金券
                    </a>
                </li>
                <li class="mui-table-view-cell" id="payment">
                    <a class="mui-navigate-right">
                        <i class="iconfont">&#xe83b;</i> 支付密码
                        <span id="pay_psw" class="mui-pull-right"></span>
                    </a>
                </li>
            </ul>
        </div>
        <script src="../js/mui.min.js" type="text/javascript" charset="utf-8"></script>
        <script src="../js/common.js" type="text/javascript" charset="utf-8"></script>
        <script src="../js/user.js" type="text/javascript" charset="utf-8"></script>
        <script type="text/javascript">
            mui.plusReady(function() {
                var psw; // 是否设置支付密码
                var isAuth = true; // 实名认证状态
                var hasAccount = true; // 是否有账户
                getData();
                function getData() {
                    var url = baseURL + 'account/getBalance.json';
                    Common.ajax({
						url : url
					}, function(data) {
                        console.log(JSON.stringify(data));
                        if(data.code == 1) {
                            var data = data.balance;
                            document.getElementById("money").innerHTML = data.money / 100;
                            //判断支付密码状态值
                            document.getElementById("pay_psw").innerHTML = data.passWord ? '已设置' : '未设置';
                            psw = data.passWord;
                        } else {
                            mui.toast('请求失败，请稍后重试');
                        }
                    }, function(xhr) {
                    	mui.toast('网络异常，请稍后再试');
                        console.error('failed - ' + xhr.status + ' : ' + xhr.statusText);
                    })
	                
                    Common.ajax({
						url : baseURL + 'account/bandCardList.json'
					}, function(data) {
                        console.log(JSON.stringify(data));
                        if(data.code == -3) {
                        	isAuth = hasAccount = false;
                        } else if(data.code == 0 || data.code == -2) {
                        	hasAccount = false;
                        }
                    }, function(xhr) {
                    	mui.toast('网络异常，请稍后再试');
                        console.error('failed - ' + xhr.status + ' : ' + xhr.statusText);
                    })
                }
                
                mui('.mui-table-view, .mui-row').on('tap', '.mui-table-view-cell, .mui-col-xs-6', function() {
                	if(this.id == 'account') { // 实名认证后可查看账户
                		if(!isAuth) {
	                		mui.toast('请先完成实名认证');
	                		return;
                		}
                	} else if (this.id == 'draw-money'){ // 添加账户后可提现
                		if(!isAuth || !hasAccount) {
	                		mui.toast('您尚未绑定账户，不能提现');
	                		return;
                		}
                	} else if (this.id == 'ticket') {
                		mui.toast('敬请期待');
	                	return;
                	}
                	Common.openWindow(this.id + '.html', {
                    	psw : psw
                    });
                }); 
                
                document.addEventListener('reload', function() {
                	getData();
                })
                
                mui('header').on('tap','.mui-pull-right',function(){
					Common.openWindow('articles-of-agreement.html');
				})
            })
        </script>
    </body>

</html>